import React,{useEffect,useState,useReducer} from "react";
import {initState,reducer} from "../Login/user"
import {reqGoodsInfo,reqShopAdd} from "../../http/api"
import { Button, Toast,NavBar,Icon } from "antd-mobile";
import "./Detail.less"
export default function Detail(props) {
  let {
    match: {
      params: { id, type },
    },
  } = props;
  const [info, setInfo] = useState({})
  const [state] = useReducer(reducer, initState)
  console.log(state);
  useEffect(() => {
    // 2.请求数据
    reqGoodsInfo({ id }).then((res) => {
      if (res.data.code === 200) {
          console.log(1);
        // 3.赋值
        setInfo(res.data.list[0]);
      }
    });
  }, []);

  return (
      <div className="details">
          <NavBar  mode="light" icon={<Icon type="left" />} onLeftClick={() => {props.history.go(-1)}} >詳情页</NavBar>
        <img src={info.img} alt="" />
        <div className="price">
          <span>￥{info.price}</span>
          <s>￥{info.market_price}</s>
        </div>
        <div>{info.goodsname}</div>
        <Button
          type="primary"
          style={{ background: "#FF6040" }}
          onClick={() => {
            reqShopAdd({
                uid:state.info.uid,
                type,
                goodsid:id,
                num:1
            }).then(res=>{
                if(res.data.code===200){
                    Toast.info(res.data.msg,1)
                }
            })
          }}
        >   
          加入购物车
        </Button>
      </div>
  );
}
